<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""DTD/xhtml1-strict.dtd">
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="/WEB-INF/c.tld" prefix="c"%>
<%@taglib uri="/WEB-INF/fmt.tld" prefix="fmt"%>
<%@taglib uri="/WEB-INF/fn.tld" prefix="fn"%>
<%@taglib uri="/WEB-INF/el.tld" prefix="el"%>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
		<c:import url="/includes/css_inc.jsp"/>
		<c:import url="/includes/js_inc.jsp"/>
		<script>
			$(function(){
		        $("#btnUpdate").button({
		            icons: {
		                primary: "ui-icon-circle-arrow-n"
		            }
		        }).click(function(){
		        	if (validateEmptyById(["#startDate","#endDate"])) {
			        	$("#job").val("updateStatement");
			        	$("#form").submit();
		        	}
		        });
		        $("#btnSearch").button({
		            icons: {
		                primary: "ui-icon-search"
		            }
		        }).click(function(){
		        	$("#job").val("search");
		        	$("#form").submit();
		        });
		        $("[name=btnView]").button({
		            icons: {
		                primary: "ui-icon-search"
		            },
            		text: false
		        });

		        $("#btnDel").button({
		            icons: {
		                primary: "ui-icon-circle-close"
		            }
		        });
		        thaiDatepicker("startDate","#","1");
		        thaiDatepicker("endDate","#","1");
			});
			function view(provinceId,chequeNo,chequeAmount,chequeReceivingDate,chqStmtKey){
				window.location='${pageContext.request.contextPath}/acc6?app=ACC60308&job=view&provinceId='+provinceId+'&chequeNo='+chequeNo+'&chequeAmount='+chequeAmount+'&chequeReceivingDate='+chequeReceivingDate+"&chqStmtKey="+chqStmtKey;
			}
			function checkAll(){
				var count = document.getElementById("count").value;
				var checkedAll = document.getElementById("checkedAll");
				var chqStmtKey = "";
				if (checkedAll.checked == true) {
					for (var i = 1; i <= count ;i++) {
						chqStmtKey = document.getElementById("chqStmtKey" + i);
						chqStmtKey.checked = true;
					}
				} else {
					for (var i = 1; i <= count ;i++) {
						chqStmtKey = document.getElementById("chqStmtKey" + i);
						chqStmtKey.checked = false;
					}
				}
			}
			function uncheck(){
				var count = document.getElementById("count").value;
				var checkedAll = document.getElementById("checkedAll");
				var countCheck = 0;
				for (var i = 1; i <= count ;i++) {
					chqStmtKey = document.getElementById("chqStmtKey" + i);
					if (chqStmtKey.checked == true){
						countCheck++;
					}
				}
				if (countCheck == count) {
					checkedAll.checked = true;
				} else {
					checkedAll.checked = false;
				}
				
			}
			function delData() {
				var count = document.getElementById("count").value;
				var onSubmit = false;
				var countCheck = 0;
				for (var i = 1; i <= count ;i++) {
					chqStmtKey = document.getElementById("chqStmtKey" + i);
					if (chqStmtKey.checked == true){
						countCheck++;
					}
				}
				if (countCheck ==0) {
					alert("กรุณาเลือกรายการที่จะลบ");
				} else {
					if(confirm('ยืนยันการลบข้อมูล')==true){
						document.getElementById("job").value = "del";
						document.getElementById("form").submit();
					}
				}
			}
		</script>
	</head>
	<body>
		<c:import url="/apps/msg.jsp"/>
		<form class="acc67-form" name="form" id="form" action="${pageContext.request.contextPath}/acc6" method="post">
		<input type="hidden" name="app" id="app" value="ACC60308"/>
		<input type="hidden" name="job" id="job" value="${job}"/>
		<table width="100%" class="ui-widget ui-widget-content" border="0">
			<tr>
				<th align="left" class="acc67-header ui-widget-header" colspan="2"><b>${screenCode.ACC60308}</b></th>
			</tr>
			<tr>
				<td class="bold" width="10%">วันที่จ่าย : </td>
				<td>
					<input type="text" name="startDate" id="startDate" size="12" maxlength="10" onkeypress="return numberAndSlash(event);" onblur="dateFormat(this);" value="${startDate}"/>
					<span class="red" id="#startDate">*</span>
					&nbsp;&nbsp; ถึง  &nbsp;&nbsp;
					<input type="text" name="endDate" id="endDate" size="12" maxlength="10" onkeypress="return numberAndSlash(event);" onblur="dateFormat(this);" value="${endDate}"/>
					<span class="red" id="#endDate">*</span>
				</td>
			</tr>
			<tr>
				<td align="center" colspan="2">
					<button type="button" name="btnUpdate" id="btnUpdate" class="acc67-button"> Update Cheque Statement </button>
				</td>
			</tr>
		</table>
		<br/><br/>
		<table  width="100%" class="ui-widget ui-widget-content" border="0">
			<tr>
				<td width="15%" class="bold">จังหวัด : </td>
				<td>
					<select name="provinceId" id="provinceId">
						<option value="">----- เลือก -----</option>
						<c:forEach var="data" items="${userInfo.listUserProvice}">
							<c:if test="${data.provinceId == provinceId}" var="provinceSeleted"/>
							<option value="${data.provinceId}" ${provinceSeleted?'selected':''}>${data.provinceName}</option>
						</c:forEach>
					</select>
				</td>
			</tr>
			<tr>
				<td class="bold">เลขที่ cheque : </td>
				<td>
					<input type="text" name="chequeNo" id="chequeNo" maxlength="8" onkeypress="return numberOnly(event, false);" value="${chequeNo}"/>
				</td>
			</tr>
			<tr>
				<td class="bold">จำนวนเงิน : </td>
				<td>
					<input type="text" name="chequeAmount" id="chequeAmount" value="<fmt:formatNumber pattern="#,##0.00"  value="${chequeAmount}" />" onkeypress="return numberAndDot(event, false);" onblur="this.value = addCommas2D(this.value);"/>
				</td>
			</tr>
			<tr>
				<td align="center" colspan="2">
					<button type="button" name="btnSearch" id="btnSearch" class="acc67-button"> ค้นหา </button>
					<c:if test="${job == 'search'}">
						<button type="button" name="btnDel" id="btnDel" onclick="delData();"> ลบข้อมูล </button>	
					</c:if>
				</td>
			</tr>
			<c:if test="${!empty pageBean}">
			<c:set var="count" value="0"/>
				<tr>
					<td colspan="2">
						<br/>
						<fieldset width="95%">
							<legend>ผลการค้นหา</legend>
							<table width="100%" class="acc67-grid ui-widget ui-widget-content">
								<tr>
									<th align="center" class="ui-state-default">
										<input type="checkbox" id="checkedAll" onclick="checkAll();"/>
									</th>
									<th align="center" class="ui-state-default" onclick="pageControl('S', 'PROVINCE_ID');"><span id="PROVINCE_ID" class="ui-icon ui-icon-triangle-2-n-s" style="float: right;"></span>จังหวัด</th>
									<th align="center" class="ui-state-default" onclick="pageControl('S', 'CHEQUE_NO');" width="15%"><span id="CHEQUE_NO" class="ui-icon ui-icon-triangle-2-n-s" style="float: right;"></span>เลขที่ cheque</th>
									<th align="center" class="ui-state-default" onclick="pageControl('S', 'CHEQUE_AMOUNT');" width="15%"><span id="CHEQUE_AMOUNT" class="ui-icon ui-icon-triangle-2-n-s" style="float: right;"></span>จำนวนเงิน</th>
									<th align="center" class="ui-state-default" onclick="pageControl('S', 'CHEQUE_RECEIVING_DATE');" width="15%"><span id="CHEQUE_RECEIVING_DATE" class="ui-icon ui-icon-triangle-2-n-s" style="float: right;"></span>วันที่ขึ้นเงิน</th>
									<th align="center" class="ui-state-default" onclick="pageControl('S', 'CREATED_DATE');" width="15%"><span id="CREATED_DATE" class="ui-icon ui-icon-triangle-2-n-s" style="float: right;"></span>วันที่สร้างรายการ</th>
									<th align="center" class="ui-state-default" width="15%">บันทึกจ่าย cheque</th>
								</tr>
								<c:forEach var="data" items="${pageBean.pageData}" varStatus="x">
									<tr class="grid-tr-${x.count % 2}">
										<td align="center">
											<input type="checkbox" name="chqStmtKey" id="chqStmtKey${x.count}" value="${data.chqStmtKey}" onclick="uncheck();"/>
										</td>
										<td>${el:getDataUtil('PAN',data.provinceId)}</td>
										<td align="center">${data.chequeNo}</td>
										<td align="right"><fmt:formatNumber pattern="#,##0.00"  value="${data.chequeAmount}"/></td>
										<td align="center">${el:dateTh(data.chequeReceivingDate)}</td>
										<td align="center">${el:dateTh(data.createdDate)}</td>
										<td align="center">
											<button type="button" name="btnView" id="btnView" class="acc67-button" onclick="view('${data.provinceId}','${data.chequeNo}','${data.chequeAmount}','${data.chequeReceivingDate}','${data.chqStmtKey}');"></button>
										</td>
									</tr>
								<c:set var="count" value="${x.count}"/>
								</c:forEach>
								<input type="hidden" name="count" id="count" value="${count}"/>
								<!-- <tr>
									<td align="center" colspan="7">
										<button type="button" name="btnDel" id="btnDel" onclick="delData();"> ลบข้อมูล </button>
									</td>
								</tr> -->
							</table>
						</fieldset>
						<input type="hidden" name="formPage" id="formPage" value="form"/>
						<c:import url="/apps/page.jsp"/>
					</td>
				</tr>
			</c:if>
		</table>
		</form>
	</body>
</html>